<!--
 * @description  : 案件-案件列表
 * @descriptionDetail: 案件-案件列表
 * @copyright    : 浙江烟草
 * @author       : mc
 * @create       : 2022-07-15 15:43:11
-->
<template>
  <view class="page">
    <!-- #ifdef H5-ONLY -->
    <theme-navbar
      :is-white="false"
      :title="navTitle"
      :custom-back="goBack"
      style="z-index: 9999"
    >
      <u-icon name="list" color="#FFF" size="38" style="margin: 0 24rpx 0 6rpx" @tap="selectCase"></u-icon>
    </theme-navbar>
    <!-- #endif -->

		<!-- #ifdef H5-WECHAT || H5-EMP -->
		<fab-button :content="fContent" @fabtrigger="fabtrigger" />
		<!-- #endif -->
    <view class="content">
      <!-- 正文内容, 绝对定位处理距离顶部高度 -->
      <view class="case-search-lay" :style="{'top': isHideNav ? 0 : '44px'}">
        <u-search
          class="case-search"
          shape="round"
          :clearabled="true"
          :showAction="true"
          :animation="true"
          actionText="确定"
          v-model="keyword"
          @custom="searchClick"
        ></u-search>
      </view>

      <list-view
        :i="0"
        :index="0"
        :top="getListViewTop()"
        :bottom="getListViewBottom()"
        :load-data="myLoadData"
        :init-load="false"
        :noMoreDataTipShow="false"
        ref="mescrollItem0"
      >

        <template slot-scope="d">
          <u-card :showFoot="false" padding="20" :showHead="false" :border="false" margin="20rpx" border-radius="30">
            <case-info-item slot="body" class="n-lay" :seal-info="d.data" :flag="true"></case-info-item>
          </u-card>
        </template>

      </list-view>
      <view class="submit-btns btn-other-cls">
        <u-button plain class="u-btn" type="primary" @click="mySimpleCase">
          简易案件
        </u-button>
        <u-button class="u-btn" type="primary" @click="myGeneralCase">
          普通案件
        </u-button>
      </view>
    </view>
    <u-popup v-model="caseShow" width="80%" mode="right">
      <view class="cearch_title">
        查询条件
      </view>
      <u-form :model="orgForm" label-position="top" label-width="auto" style="padding: 80rpx 32rpx 0 32rpx" ref="uForm">
        <u-form-item label="案件类型:" prop="handleProc">
          <dic-input
            :keyWord="$u.dic.DIC_KEYS.C_CASE_TYPE"
            :dicCode="orgForm.handleProc"
            :border="ifborder"
            inputAlign="left"
            type="select"
            :select-open="dicSelectOpen('handleProc',$u.dic.DIC_KEYS.C_CASE_TYPE)"
            placeholder="请选择"
            v-model="orgForm.handleProcName"
            @changeInputModelData="(name)=>{$set(orgForm, 'handleProcName', name)}"
            @click="showDic($u.dic.DIC_KEYS.C_CASE_TYPE,orgForm.handleProc,'handleProc')"
          />
        </u-form-item>
      </u-form>
      <view class="submit-btns btn-other-cls">
        <u-button plain class="del" type="primary" @click="close">
          重置
        </u-button>
        <u-button class="mit" type="primary" @click="selectChange">
          确定
        </u-button>
      </view>
    </u-popup>
    <!-- 下拉选择用 -->
    <dic-choice
      :keyWord="dicKeyWords"
      :currentSelect="dicCurrentSelect"
      v-model="dicShow"
      @confirm="selectDicConfirm"
    ></dic-choice>
  </view>
</template>

<script>
	import listView from '@/components/list_view.vue';
	import MescrollMoreMixin from '@/components/mescroll-uni/mixins/mescroll-more.js';
	import CaseInfoItem from './components/caseInfoItem.vue';
	import caseService from '@/service/case/case.service';
	import checkService from '@/service/check/check.service';
	import DicInput from '@/components/dic_input.vue';
	import DicChoice from '@/components/dic_choice.vue';
	import {
		CASE_TYPE,
	} from '@/service/case/mapping/index.js';
	import {
		ifSimpleCase,
	} from '@/config/setting.config';
	import fabButton from '@/components/uni-fab.vue';

	export default {
		components: {
			listView,
			'case-info-item': CaseInfoItem,
			DicInput,
			DicChoice,
			fabButton
		},
		mixins: [MescrollMoreMixin, ],
		data() {
			return {
				userCode: '',
				videoId: '', // 视频id
				keyword: '',
				requestParam: {
					page: 1,
					limit: 10,
				},
				defaultCaseClue: {},
				isStatus: false, // 控制一般案件和简易案件保存后 返回刷新
				caseShow: false,
				orgForm: {},
				// dic_select 是否显示
				dicShow: false,
				// dic 关键字
				dicKeyWords: '',
				// dic 当前选择项
				dicCurrentSelect: '',
				dicType: '',
				// 输入框是否有border
				ifborder: false,
				fContent: [{
					iconPath: require('@/static/sou.png'),
					selectedIconPath: require('@/static/sou.png'),
					text: '筛选',
					active: false,
				}],
				ifSimpleCase: '',
			};
		},
		created() {
			this.ifSimpleCase = ifSimpleCase;
		},
		mounted() {
			this.setRightBtns();
			this.userCode = this.$storage.get(this.$rp.common.USER).user.personCode;
			this.init();
    			this.setRightBtns()
			// 案件记录仪
			// this.initVideo()
		},
		onShow() {
			if (this.isStatus) {
				this.getMescroll(this.tabIndex).triggerDownScroll();
				this.isStatus = false;
			}
		},
		methods: {
			setRightBtns() {
				// #ifdef H5-DINGDING
				this.$deviceApi.setRight('筛选', () => {
					this.selectCase();
					this.setRightBtns();
				}, true, true);
				// #endif
			},
			fabtrigger(btn) {
				if (btn.index == 0) {
					this.selectCase();
				}
			},
			init() {
				caseService
					.casePropertyList()
					.then((res) => {
						this.$modal.hideLoading();
						if (!res.success) {
							return;
						}
						if (res.data && res.data.length > 0) {
							this.defaultCaseClue = res.data[0];
						}
					})
					.catch((err) => {
						console.log('查询失败:' + err);
					});
			},
			initVideo() {
				let self = this;
				let vStatus1 = document.getElementById('v_status1');
				let vStatus2 = document.getElementById('v_status2');
				window.openVideo = function() {
					vStatus1.style.display = 'none';
					vStatus2.style.display = 'block';
					self.openRecord();
				};
				window.closeVideo = function() {
					vStatus1.style.display = 'block';
					vStatus2.style.display = 'none';
					self.endClick();
				};
			},
			// 打开视频录像
			openRecord() {
				// 判断是否在录制
				checkService
					.getUserLiveList({
						userName: this.userCode,
						page: 1,
						pageSize: 10,
					})
					.then((res) => {
						if (res.data.length == 0) {
							// 未录制 则开启录制
							let timer = new Date();
							let startTime = this.$u.timeFormat(timer, 'yyyy-mm-dd hh:MM:ss');
							checkService.saveBusTimeLine({
								// bizId:'', // 文书id
								startTime: startTime,
							});
						}
						checkService
							.openCamera({
								userName: this.userCode,
							})
							.then((res) => {
								this.videoId = res.bean;
								this.state = true;
								if (res.success) {
									console.log('开启录制成功');
									// this.saveVideoBussRef();
								} else {
									this.$modal.alert('开启录制失败请检查设备是否开启或登录');
								}
							});
					});
			},
			// 绑定视频与业务关系
			saveVideoBussRef() {
				checkService
					.saveVideoBussRef({
						videoId: this.videoId,
						userName: this.userCode,
					})
					.then((it) => {
						if (it.success) {
							console.log('绑定业务成功');
						} else {
							console.log(it.msg);
						}
					});
			},
			selectCase() {
				this.caseShow = true;
			},
			dicSelectOpen(type, keyWords) {
				if (type == this.dicType) {
					if (this.dicKeyWords == keyWords && this.dicShow) {
						return true;
					}
					return false;
				}
			},
			showDic(key, cur, type) {
				if (this.dicShow) return;
				this.dicKeyWords = key;
				this.dicCurrentSelect = cur;
				this.dicShow = true;
				this.dicType = type;
			},
			selectDicConfirm(e) {
				if (this.dicKeyWords == this.$u.dic.DIC_KEYS.C_CASE_TYPE) {
					// 未办证原因
					this.orgForm.handleProcName = e[0].label;
					this.orgForm.handleProc = e[0].extra.bcbCode;
				}
			},
			close() {
				this.orgForm = {};
			},
			selectChange() {
				this.caseShow = false;
				// this.searchObj = this.orgForm;
				this.getMescroll(this.tabIndex).triggerDownScroll();
			},
			// 关闭录像
			endClick() {
				checkService
					.getUserLiveList({
						userName: this.userCode,
						page: 1,
						pageSize: 10,
					})
					.then((dr) => {
						if (dr.data.length != 0) {
							let timer = new Date();
							let endTime = this.$u.timeFormat(timer, 'yyyy-mm-dd hh:MM:ss');
							checkService.saveBusTimeLine({
								// bizId:‘’, // 文书id
								endTime: endTime,
							});
						}
						checkService
							.closeCamera({
								userName: this.userCode,
							})
							.then((res) => {
								if (res.success) {
									this.state = false;
								}
							});
					});
			},
			//  获取列表距离顶部的高度
			getListViewTop() {
				let p = this.$u.sys().statusBarHeight + uni.upx2px(104) + 'px';
				return p;
			},
			getListViewBottom() {
				return uni.upx2px(120) + 5;
			},
			searchClick: function() {
				this.getMescroll(this.tabIndex).triggerDownScroll();
			},
			// 案件查询数据
			myLoadData(page) {
				let self = this;
				this.requestParam.page = page.num;
				this.requestParam.limit = page.size;
				this.requestParam.caseCode = this.keyword;
				this.requestParam.handleProc = this.orgForm.handleProc || '';
				return new Promise((resolve) => {
					caseService
						.caseList(self.requestParam)
						.then((res) => {
							if (res.success) {
								let arr = res.data;
								arr.forEach((itm) => {
									if (itm.handleProc == CASE_TYPE.SIMPLE && this.$u.test.isEmpty(itm.caseOfAction)) {
										itm.caseOfAction = this.defaultCaseClue.caseProperty;
									}
									self.$set(itm, 'show', false);
								});
								resolve({
									data: {
										list: arr,
										totalCount: res.count,
									},
								});
							} else {
								self.$modal.alert(res.msg);
								resolve({
									data: {
										list: [],
										totalCount: 0,
									},
								});
							}
						})
						.catch((err) => {
							self.$modal.alert(err);
							resolve({
								data: {
									list: [],
									totalCount: 0,
								},
							});
						});
				});
			},
			// 简易案件
			mySimpleCase() {
				this.isStatus = true;
				this.setRouteParam({
					initQueryData: {},
				});
				this.$u.route({
					url: '/pages/case/components/caseFilingLink',
					type: 'to',
					params: {
						caseType: CASE_TYPE.SIMPLE,
					},
				});
			},
			// 一般案件
			myGeneralCase() {
				this.isStatus = true;
				this.setRouteParam({
					initQueryData: {},
				});
				this.$u.route({
					url: '/pages/case/components/caseFilingLink',
					type: 'to',
					params: {
						caseType: CASE_TYPE.NORMAL,
					},
				});
			}
		},
	};
</script>

<style lang="scss" scoped>
	@import './case_common.scss';

	.page {
		padding: 0;
		//padding-bottom: 50px;
	}

	.content {
		background-color: #f3f4f6;
	}

	.cearch_title {
		background-color: #f3f4f5;
		width: 100%;
		height: 82rpx;
		font-size: 32rpx;
		font-weight: 600;
		padding: 22rpx 0 21rpx 32rpx;
		z-index: 999;
		position: fixed;
	}

	.n-lay {
		width: 100%;
		padding: 15rpx;
	}

	.case-search-lay {
		background-color: #fff;
		position: fixed;
		top: 0px;
		z-index: 999;
		width: 100%;
		padding: $cm-search-padding-row $cm-search-padding-column;
	}

	.mc-divider {
		width: 100%;
		height: 10px;
		background-color: $uni-bg-color-grey;
	}

	.case-search {
		// margin-bottom: 20rpx !important;
	}

	.tabs-bottom {
		border-bottom: 2rpx solid $border-color-dark;
	}

	.message-box {
		color: $u-type-primary !important;
	}

	.mescroll {
		margin-bottom: 15px;
	}

	.tabsBottom {}

	.nav-right-icon {
		margin-right: 30rpx;
		font-size: 0.8rem;
		color: $u-type-primary;
	}

	.p-item {
		margin: 5px 0px;

		.icon {
			color: #666;
		}

		.text {
			margin-left: 5px;
			color: #333;
		}
	}
</style>
